import React, { useState, useEffect } from 'react';
import '../static/css/BBDList.css'
import { List, Icon, Card, Input, Modal, message, Button, Drawer, Table,Switch } from 'antd';

import axios from 'axios'
import servicePath from '../config/apiUrl'
import ClearableLabeledInput from 'antd/lib/input/ClearableLabeledInput';
import moment from "moment"
const { confirm } = Modal;
const { TextArea } = Input;





function MsgList(props) {
    const [articleMsg, setArticleMsg] = useState("")
    const initMsg = () => {
        axios({ method: 'post', url: servicePath.oneArticleMsg, withCredentials: true }).then(res => {
            setArticleMsg(res.data.data)
        })
    }
    useEffect(() => {
        initMsg()
        console.log("11")
    }, [])

    let handelChange = (record,text)=>{
        console.log(record,text)
        console.log(servicePath.changeMsgStatus)
        axios({ method: 'post', url: servicePath.changeMsgStatus,data:{id:record.id,status:text==0?1:0}, withCredentials: true }).then(res=>{
            initMsg()
        })
    }
    let handelDelete =(record,text)=>{
        axios({ method: 'post', url: servicePath.deleteMsg,data:{id:record.id}, withCredentials: true }).then(res => {
            message.success("留言删除成功")
            initMsg()
        })
    }
    const columns = [
        {
            title: '用户名',
            dataIndex: 'userName',
            key: 'userName',
            render: text => <span>{text}</span>,
        },
        {
            title: '邮箱',
            dataIndex: 'email',
            key: 'email',
        },
        {
            title: '内容',
            dataIndex: 'content',
            key: 'content',
        },
        {
            title: '留言时间',
            dataIndex: 'addTime',
            key: 'addTime',
            render: text => <span>{moment(text).format('YYYY-MM-DD hh:mm:ss')}</span>,
        },
        {
            title: '是否显示',
            dataIndex: 'status',
            key: 'status',
            render: (text,record) => <Switch checked={text==1} onChange={handelChange.bind(this,record,text)}  />,
        },
        {
            title: '操作',
            dataIndex: 'url',
            key: 'url',
            render: (text,record) => <Button  onClick={handelDelete.bind(this,record,text)}>
                删除
            </Button>,
            
        }

    ];
    return (
        <div>
            <Table columns={columns} dataSource={articleMsg} />
        </div>
    )

}

export default MsgList